<template>
  <div>
    <div class="table-ctrl-body">
      <!--按钮组-->
      <div class="Btns-ctrl-body">
        <!--高级搜索-->
        <SearchPublic
          :searchObj="searchObj"
          @searchShow="searchShowFn"
          @searchParams="searchParamsFn"
        ></SearchPublic>

        <div class="btns f-r">
          <button type="button" class="btn btn-info" @click="toggleAddModal">新增</button>
          <button type="button" class="btn btn-warning" @click="toggleUploadeModal('update')">修改</button>
          <button type="button" class="btn btn-warning" @click="toggleUploadeModal('detail')">详情</button>
          <button type="button" class="btn btn-danger" @click="deleteFn">删除</button>
        </div>
      </div>
      <!--按钮组闭合-->
      <!--表格组-->
      <div class="table-ctrl">
        <!--表格头-->
        <!--{{treeTableRow}}-->
        <div class="table-header">
          <table class="table-default">
            <thead>
            <tr>
              <th v-for="ths in tableHeader">
                {{ths.value}}
              </th>
            </tr>
            </thead>
          </table>
        </div>
        <!--表格中部-->
        <div class="table-overflowX">
          <table class="table-default">
            <tbody>
            <tr
              v-for="(trs,index) in tableRow.list"
              @click="selectRow(trs,index)"
              :class="{active: index === isActive}"
            >
              <td v-for="tds in tableHeader">
                {{trs[tds.key]}}
              </td>
            </tr>
            </tbody>
          </table>
        </div>

        <!--表格翻页-->
        <Pages
          v-show="tableRow.total !== 0"
          v-if="tableRow"
          :showItem="10"
          :pageSize="Number(tableRowParams.pageSize)"
          :allDataSum="tableRow.total"
          :allpage="(Math.ceil(tableRow.total/tableRowParams.pageSize))"
          @current-change="tablePageData"
        ></Pages>

      </div>

      <!--新增-->
      <AddTaskConfig :addModalObj="addModalObj"
                     :fromJoinIdData="fromJoinIdData"
                     :taskType="taskType"
                @closeModal="toggleAddModal">
      </AddTaskConfig>

      <!--修改-->
      <RevTaskConfig :RevTaskConfigObj="RevTaskConfigObj"
                     :fromJoinIdData="fromJoinIdData"
                     :taskType="taskType"
                   @closeModal="toggleUploadeModal"></RevTaskConfig>

    </div>
  </div>
</template>

<script>
  import Pages from "../../sudoku/atom/pages"
  import SearchPublic from "../refreshSearch/refrashSearch"
  import AddTaskConfig from './AddTaskConfig'
  import RevTaskConfig from './RevTaskConfig'
  export default {
    name: "taskConfig",
    data(){
      return{
        searchObj:{
          condition:[
            {"title":"任务名称","key":"name",'type':'text',"value":'','data':''},
            {"title":"比较类型","key":"func","value":'','type':'select','data': ''},
            {"title":"逻辑名称","key":"fromJoinId","value":'','type':'select','data': ''},
          ],
          htmlType:"searchDefaultPublic",
        },
        isActive:-1,
        selectRowId:"",
        tableHeader:[
          {"key":"name","value":"任务名称"},
          {"key":"jobHandler","value":"任务ID"},
          {"key":"typeIdName","value":"接入类型"},
          {"key":"fromJoinIdName","value":"逻辑名称"},
          {"key":"createTime","value":"创建时间"},
          {"key":"creator","value":"创建人"},
        ],
        taskType: [], // 接入类型
        fromJoinIdData: [], // 接入类型
        tableRow: {
          list: [],
          total: 0
        },
        tableRowParams : {
          pageIndex:"1", //当前页
          pageSize:"20", //数量
        },
        addModalObj:{
          isShow:false,
        },
        RevTaskConfigObj:{
          isShow: false,
          id:"",
          type: ''
        },
        readey: {
          fromJoinIdData: false
        }
      }
    },
    components:{
      Pages,
      SearchPublic,
      AddTaskConfig,
      RevTaskConfig
    },
    mounted(){
      this.getDataContentDef().then(item => {
        if(this.readey.fromJoinIdData) {
          // 接入类型
          this.getType('taskType').then(item => {
            // 比较类型
            this.getType('compareType').then(item => {
              this.tableRowAjax();
            })
          })
        } else {
          this.getDataContentDef()
        }
      })
    },
    methods:{
      // 搜索框 展示
      searchShowFn () {
        // this.getDataContentDef()
      },
      // 获取对比类型
      getType (str) {
        return this.$axios({
          url: this.Dictionary + "/tag/detail/type/" + str + "/key/" + str,
          method: 'get'
        }).then(res => {
          let data = []
          res.data.objs.map(item => {
            data.push({
              key: item.name,
              value: item.code,
              description: item.description
            })
          })
          if (str === 'compareType'){
            this.searchObj.condition[1].data = data
          } else if (str === 'taskType') {
            this[str] = data
          }
        }).catch(err => {
          console.log(err, '获取' + str)
        })
      },
      // 获取数据内容定义（逻辑名称）
      getDataContentDef () {
        //清除选择
        let _url = this.Beacon +
          '/join/showList?' +
          'name=' +
          '&datasourceId=' +
          '&size=10000' +
          '&current=1'
        this.s_loading(true)
        return this.$axios.get(_url).then(res =>{
            this.s_loading(false)
            let searchData = []
            res.data.content.records.map(item => {
              searchData.push({
                key: item.name,
                value: item.id
              })
            })
            this.searchObj.condition[2].data = searchData
            this.fromJoinIdData = searchData
            this.readey.fromJoinIdData = true
          })
          .catch((err)=>{
            console.log(err, "逻辑名称");
            this.readey.fromJoinIdData = false
          })
      },
      // 接入类型
      taskTypeFn (type) {
        let data = this.taskType.filter(item => {
          if (item.value == type) {
            return true
          }
        })
        if (data.length <= 0) {
          this.s_alert('对接类型和字典匹配不上，请联系管理员')
          return type
        } else {
          return data[0].key
        }
      },
      // 逻辑名称
      fromJoinIdDataFn (type) {
        let data = this.fromJoinIdData.filter(item => {
          if (item.value == type) {
            return true
          }
        })
        if (data.length <= 0) {
          this.s_alert('逻辑名称数据有问题，请联系管理员')
          return type
        } else {
          return data[0].key
        }
      },
      //加载表格
      tableRowAjax(){
        this.clearSelect();
        this.s_loading(true)
        this.tableRowRealAjax()
      },
      tableRowRealAjax () {
        let _url = this.Beacon +
          '/transaction/showList?' +
          'name=' + encodeURIComponent(this.searchObj.condition[0].value) +
          '&func=' + this.searchObj.condition[1].value +
          '&fromJoinId=' + this.searchObj.condition[2].value +
          '&size=' +
          this.tableRowParams.pageSize +
          '&current=' +
          this.tableRowParams.pageIndex;
        let self = this
        this.$axios.get(_url)
          .then(res =>{
            //console.log(data);
            let _list = []
            res.data.content.records.map((item, index) => {
              _list.push(item)
              _list[index]['typeIdName'] = this.taskTypeFn(item.typeId)
              _list[index]['fromJoinIdName'] = this.fromJoinIdDataFn(item.fromJoinId)
            })
            this.tableRow.list = _list;
            console.log(this.tableRow.list);
            this.tableRow.total = res.data.content.total;
            this.s_loading(false)
          })
          .catch((err)=>{
            //console.log(err);
          })
      },
      //翻页加载
      tablePageData(page){
        this.tableRowParams.pageIndex = page
        this.tableRowRealAjax();
        //console.log(page);
      },
      //新增弹窗显示与隐藏
      toggleAddModal(){
        this.addModalObj.isShow = !this.addModalObj.isShow;
        if( this.addModalObj.isShow === false ){
          //重新加载表格
          this.tableRowRealAjax();
        }
      },
      //修改弹窗显示与隐藏
      toggleUploadeModal(str){
        if( this.selectRowId !=="" ){
          this.RevTaskConfigObj.isShow = !this.RevTaskConfigObj.isShow;
          this.RevTaskConfigObj.type = str;
        }else{
          if(str == 'update') {
            this.s_alert("请选择需要修改的数据源！");
            return
          } else if (str == 'detail') {
            this.s_alert("请选择需要查看的数据源！");
            return
          }
        }
        if( this.RevTaskConfigObj.isShow === false ){
          //重新加载表格
          this.tableRowRealAjax();
          this.clearSelect()
        }
      },
      //选择行
      selectRow(obj,index){
        // console.log(JSON.stringify(obj));
        this.selectRowId = obj.id;
        this.RevTaskConfigObj.id = obj.id;
        this.isActive = index;
      },
      //删除
      deleteFn(){
        if( this.selectRowId !=="" ){
          let msg = confirm("请问是否删除该任务配置？");
          if( msg ){
            //DELETE /datasource/delete/{}
            this.$axios.delete(this.Beacon+"/transaction/delete/" + this.selectRowId)
              .then((data)=>{
                this.s_alert("删除成功！");
                this.tableRowRealAjax();
              })
              .catch((err)=>{
                this.s_alert("删除失败！");
                //console.log(err);
              })
          }
        }else{
          this.s_alert("请选择需要删除的任务配置！");
        }
      },
      //搜索
      searchParamsFn(searchParams){
        this.tableRowRealAjax();
      },
      //清除选择
      clearSelect(){
        this.isActive = -1;
        this.selectRowId = "";
        this.RevTaskConfigObj.id = "";
      }
    },
    watch: {

    }
  }
</script>

<style scoped>

</style>
